{% extends "base.html" %}

{% block title %}QD 记事本{% endblock %}

{% block header %}
{{ super() }}
<link href="{{ static_url('css/my.css') }}" rel="stylesheet" type="text/css">
{% endblock %}

{% block body %}
{{ utils.header(current_user) }}

<section>
  <div class="container">
    <h2>
      记事本
    </h2>
    <div id="run-result"></div>
    <div class="form-group">
      <label class="control-label" for="note" ><font color='red'>除查询以外, 必须输入账号密码验证！！！</font></label>
      <div>
      <label class="control-label" for="note">邮箱</label>
      </div>
      <input type="text" class="form-control" name="email" value="" id="email" placeholder="必须输入账号验证">
      <label class="control-label" for="note">密码</label>
      <input type='password' class="form-control" name="pwd" value="" id="pwd" placeholder="必须输入密码验证">
    </div>
    <div class="form-group">
      <label class="control-label" for="note">记事本编号:</label>
      <input id="notepad_list" type="text" class="form-control" list="NotePadIDList" value="{{notepad_id}}"></input>
      <datalist id="NotePadIDList">
        {% for notepad in notepad_list %}
        <option value="{{ notepad.notepadid }}">{{ (notepad.content or 'None')|truncate(length=26, killwords=False, end='...', leeway=4) }}</option>
        {% endfor %}
      </datalist>
    </div>
    <div class="text-right">
      <button id="notepad_list_btn" type="submit" data-loading-text="loading..." class="btn btn-primary" onclick="window.location.assign('/util/toolbox/{{userid}}/notepad/'+($('#notepad_list')[0].value || '0'))">查询</button>
      <button id="notepad_list_btn_add" type="submit" data-loading-text="loading..." class="btn btn-primary" onclick="notepadlist('add')">新建</button>
      <button id="notepad_list_btn_del" type="submit" data-loading-text="loading..." class="btn btn-primary" onclick="notepadlist('delete')">删除</button>
    </div>
    <div class="form-group">
      <label class="control-label" for="note">记事本内容:</label>
      <textarea  class="form-control" rows="10" name="New_notepad_content" id="New_notepad_content" >{% for notepad in notepad_list %}{% if notepad.notepadid == notepad_id and notepad.content %}{{notepad.content}}{% endif %}{% endfor %}</textarea>
    </div>
    <div class="text-right">
      <button id="ban" name="banbtn" type="submit" data-loading-text="loading..." class="btn btn-primary" onclick="send2notepad('append')" title="将文本框内容追加至记事本中">追加</button>
      <button id="activate" name="activatebtn" type="submit" data-loading-text="loading..." class="btn btn-primary"  onclick="send2notepad('write')" title="将文本框内容复写至记事本中">复写</button>
    </div>
  </div>
</section>



<script>
  function send2notepad(mode){
    if ($('#notepad_list')[0].value == '') {
      $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text("记事本编号不能为空");
      return;
    }
    if ($('#email')[0].value == '') {
      $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text("邮箱不能为空");
      return;
    }
    if ($('#pwd')[0].value == '') {
      $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text("密码不能为空");
      return;
    }
    data = {}
    data['f'] = mode
    data['email'] = $('#email')[0].value;
    data['pwd'] = md5($('#pwd')[0].value);
    data['data'] = $('#New_notepad_content')[0].value;
    data['id_notepad'] = $('#notepad_list')[0].value;
    $.ajax("/util/toolbox/{{ userid }}/notepad", {
          type: 'POST',
          data: data,
        })
        .done(function(jxhr) {
          window.location.assign('/util/toolbox/{{userid}}/notepad/'+$('#notepad_list')[0].value);
        })
        .fail(function(jxhr) {
          $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text(jxhr.responseText);
        })
  }
</script>

<script>
  function notepadlist(mode){
    if ($('#notepad_list')[0].value == '') {
      $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text("记事本编号不能为空");
      return;
    }
    if ($('#email')[0].value == '') {
      $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text("邮箱不能为空");
      return;
    }
    if ($('#pwd')[0].value == '') {
      $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text("密码不能为空");
      return;
    }
    data = {}
    data['f'] = mode
    data['email'] = $('#email')[0].value;
    data['pwd'] = md5($('#pwd')[0].value);
    data['id_notepad'] = $('#notepad_list')[0].value;
    $.ajax("/util/toolbox/{{ userid }}/notepad/list", {
          type: 'POST',
          data: data,
        })
        .done(function(jxhr) {
          if (data['id_notepad'] && data['f'] != 'delete'){
            window.location.assign('/util/toolbox/{{userid}}/notepad/'+data['id_notepad']);
          } else {
            window.location.assign('/util/toolbox/{{userid}}/notepad/0');
          }
        })
        .fail(function(jxhr) {
          $('#run-result').html('<h1 class="alert alert-danger text-center">设置失败</h1><div class="well"></div>').show().find('div').text(jxhr.responseText);
        })
  }
  </script>

{% endblock %}
